"use client";
import { Sidebar } from "flowbite-react";
import { HiStar, HiOutlinePrinter, HiOutlineTag, HiInbox, HiBookOpen, HiViewBoards, HiUser, HiOutlineMinusSm, HiNewspaper } from "react-icons/hi";
import { useEffect, useState } from 'react';
export default function BookMetaList({bookMeta, onItemClick }) {

    return (<>
        <Sidebar aria-label="Sidebar with multi-level dropdown example">
            <Sidebar.Items>
                <Sidebar.ItemGroup>
                    <Sidebar.Collapse icon={HiUser} label="作者">
                        {
                            bookMeta.author.map((item, index) => (
                                <Sidebar.Item key={index} href="#"  onClick={() => onItemClick("author",item)}>{item}</Sidebar.Item>
                            ))
                        }
                    </Sidebar.Collapse>
                    <Sidebar.Collapse icon={HiOutlineMinusSm} label="语言">
                        {
                            bookMeta.bookLang.map((item, index) => (
                                <Sidebar.Item key={index} href="#" onClick={() => onItemClick("bookLang",item)} >{item}</Sidebar.Item>
                            ))
                        }
                    </Sidebar.Collapse>
                    <Sidebar.Collapse icon={HiViewBoards} label="丛书">
                        {
                            bookMeta.series.map((item, index) => (
                                <Sidebar.Item key={index} href="#" onClick={() => onItemClick("series",item)} >{item}</Sidebar.Item>
                            ))
                        }
                    </Sidebar.Collapse>
                    <Sidebar.Collapse icon={HiBookOpen} label="格式">
                        {
                            bookMeta.bookFormat.map((item, index) => (
                                <Sidebar.Item key={index} href="#" onClick={() => onItemClick("bookFormat",item)} >{item}</Sidebar.Item>
                            ))
                        }
                    </Sidebar.Collapse>
                    <Sidebar.Collapse icon={HiOutlinePrinter} label="出版商">
                        {
                            bookMeta.bookPublish.map((item, index) => (
                                <Sidebar.Item key={index} href="#" onClick={() => onItemClick("bookPublish",item)} >{item}</Sidebar.Item>
                            ))
                        }
                    </Sidebar.Collapse>
                    <Sidebar.Collapse icon={HiStar} label="评分">
                        {
                            bookMeta.bookRate.map((item, index) => (
                                <Sidebar.Item key={index} href="#" onClick={() => onItemClick("bookRate",item)} >{item}</Sidebar.Item>
                            ))
                        }
                    </Sidebar.Collapse>
                    <Sidebar.Collapse icon={HiOutlineTag} label="标签">
                        {
                            bookMeta.bookTag.map((item, index) => (
                                <Sidebar.Item key={index} href="#" onClick={() => onItemClick("bookTag",item)} >{item}</Sidebar.Item>
                            ))
                        }
                    </Sidebar.Collapse>
                    <Sidebar.Collapse icon={HiNewspaper} label="标识码">
                        {
                            bookMeta.tagCode.map((item, index) => (
                                <Sidebar.Item key={index} href="#" onClick={() => onItemClick("tagCode",item)} >{item}</Sidebar.Item>
                            ))
                        }
                    </Sidebar.Collapse>

                </Sidebar.ItemGroup>
            </Sidebar.Items>
        </Sidebar>
    </>)
}